<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title></title>
</head>
<body>
<!--弹窗：单据信息-->
<div th:fragment="pzDetail" class="modal inmodal fade" id="pzDetail_Modal" tabindex="-1" role="dialog"
     aria-hidden="true" data-backdrop="static">
    <div class="card" id="pzcurmainDetail_tab">
        <div class="card-header">
            <ul class="nav nav-tabs card-header-tabs">
                <li class="nav-item"><a class="nav-link" data-toggle="tab" data-item="detail"
                                        href="#tab-detail">单据详情</a></li>
                <li class="nav-item"><a class="nav-link" data-toggle="tab" data-item="budget"
                                        href="#tab-budget">申请明细</a></li>
                <li class="nav-item"><a class="nav-link" data-toggle="tab" data-item="attach"
                                        href="#tab-attach">相关附件</a></li>
                <li class="nav-item trip d-none"><a class="nav-link" data-toggle="tab" data-item="trip"
                                                    href="#tab-trip">出差信息</a>
                </li>
                <li class="nav-item"><a class="nav-link" data-toggle="tab" data-item="special"
                                        href="#tab-special">小纸条</a></li>
            </ul>
        </div>
        <div class="card-body">
            <div class="tab-content">
                <!--                详情-->
                <div role="tabpanel" id="tab-detail" class="tab-pane">
                    <div class="panel-body">
                        <div th:replace="web/pz/cur/pzcurmain-detail-info::pzcurmainDetailInfo"></div>
                    </div>
                </div>
                <!--                预算-->
                <div role="tabpanel" id="tab-budget" class="tab-pane">
                    <div class="panel-body">
                        <div th:replace="web/pz/cur/pzcurmain-detail-budget::pzcurmainDetailBudget"></div>
                    </div>
                </div>
                <div role="tabpanel" id="tab-attach" class="tab-pane">
                    <div class="panel-body">
                        <div th:replace="web/pz/cur/pzcurmain-detail-attach::pzcurmainDetailAttach"></div>
                    </div>
                </div>
                <div role="tabpanel" id="tab-trip" class="tab-pane trip">
                    <div class="panel-body">
                        <div th:replace="web/pz/cur/pzcurmain-detail-trip::pzcurmainDetailTrip"></div>
                    </div>
                </div>
                <div role="tabpanel" id="tab-special" class="tab-pane">
                    <div class="panel-body">
                        <div th:replace="web/pz/cur/pzcurmain-detail-special::pzcurmainDetailSpecial"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-12 m-b">
            <div class="d-flex flex-row justify-content-center">
                <button type="button" class="btn btn-lg btn-primary" onclick="pzcurmainDetailObj.saveInfo()">
                    保存单据
                </button>
                <button type="button" class="btn btn-lg btn-info m-l invisible afterSave"
                        onclick="pzcurmainDetailObj.saveAudit()">
                    提交审核
                </button>
                <button type="button" class="btn btn-lg btn-success m-l invisible afterSave"
                        onclick="pzcurmainDetailObj.authHandle()">
                    委托办理
                </button>
            </div>
        </div>
    </div>
    <!--弹窗：人员选择-->
    <div class="modal inmodal fade" id="pzcurmainDetail_Modal"
         tabindex="-1" role="dialog" aria-hidden="true">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal"><span
                            aria-hidden="true">&times;</span><span
                            class="sr-only">Close</span></button>
                    <h4 class="modal-title" id="pzcurmainDetail_modalTitle">选择人员</h4>
                    <p id="pzcurmainDetail_modalDesc" class="font-bold text-danger"></p>
                </div>
                <div class="modal-body">
                    <div class="m-l-xs toolbar text-danger" id="pzcurmainDetail_table_toolbar">
                        搜索后显示结果
                    </div>
                    <table id="pzcurmainDetail_table_user" class="table table-striped"></table>
                    <div class="pull-right">
                        <button type="submit" class="btn btn-primary"
                                onclick="pzcurmainDetailObj.saveAuthHandle()">
                            确定
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <script type="text/javascript">
        $(function () {
            let mainId = '[[${mainId}]]';
            let dKey = '[[${dKey}]]';
            let proArrs = [];
            if (mainId) {
                proArrs.push(new Promise(function (resolve, reject) {
                    $.myPost({
                        url: '/pz/cur/pzmain/detail',
                        dataType: 'json',
                        data: {
                            mainId: mainId,
                            applyType: dKey
                        },
                        success: function (data) {
                            if (data && data.code === 0) {
                                resolve(data);
                            } else {
                                reject(error);
                            }
                        }
                    })
                }));
            } else {
                proArrs.push(new Promise(function (resolve, reject) {
                    $.myGet({
                        url: `/pz/cur/pzmain/newApply/${dKey}`,
                        success: function (data) {
                            if (data && data.code === 0) {
                                resolve(data);
                            } else {
                                reject(error);
                            }
                        }
                    })
                }));
            }
            // 管理部门、重要程度、经费类型
            proArrs.push(new Promise(function (resolve, reject) {
                $.myGet({
                    url: `/pz/cur/pzmain/newApply/applySelectData`,
                    success: function (data) {
                        if (data && data.code === 0) {
                            resolve(data);
                        } else {
                            reject(error);
                        }
                    }
                })
            }));
            $('a[data-toggle="tab"]').on('shown.bs.tab', function (e) {
                if (e.target.dataset.item == 'detail') {
                    pzcurmainDetailInfoObj.init(
                        pzcurmainDetailObj.data,
                        pzcurmainDetailObj.dataSelect);
                } else if (e.target.dataset.item == 'budget') {
                    pzcurmainDetailBudgetListObj.init(dKey, pzcurmainDetailObj.mainId, pzcurmainDetailObj.dataSelect.depts)
                } else if (e.target.dataset.item == 'attach') {
                    pzcurmainDetailAttachObj.init();
                } else if (e.target.dataset.item == 'trip') {
                    pzcurmainDetailTripListObj.init();
                } else if (e.target.dataset.item == 'special') {
                    pzcurmainDetailSpecialObj.init();
                }
            })
            Promise.all(proArrs).then(values => {
                let dataPz = values[0];
                let dataSelect = values[1];
                if (dataPz && dataPz.code === 0) {
                    pzcurmainDetailObj.mainId = dataPz.pz.pzMainVO.mainId;
                    pzcurmainDetailObj.applyType = dKey;
                    pzcurmainDetailObj.data = dataPz.pz;
                    if (dataPz.pz.pzMainVO.state == 1) {
                        pzcurmainDetailObj.toggleBtn(true);
                    }
                } else {
                    toastr.error(dataPz.msg, '操作失败')
                }
                if (dataSelect && dataSelect.code === 0) {
                    pzcurmainDetailObj.dataSelect = dataSelect;
                    $('#pzcurmainDetail_tab a:first').tab('show')
                } else {
                    toastr.error(dataSelect.msg, '操作失败')
                }
            })
            pzcurmainDetailObj.myTableUser = $('#pzcurmainDetail_table_user').bootstrapTable({
                toolbar: '#pzcurmainDetail_table_toolbar',
                url: 'pz/cur/pzteacher',
                search: true,
                trimOnSearch: true,
                pagination: true,
                sidePagination: 'server',
                clickToSelect: true,
                formatNoMatches: function () {  //没有匹配的结果
                    return '暂无数据';
                },
                columns: [{
                    title: '#',
                    align: 'center',
                    width: 50,
                    redio: true,
                    formatter: function (value, row, index) {
                        return index + 1;
                    }
                }, {
                    title: '姓名',
                    field: 'name',
                    width: 200,
                }, {
                    title: '所属部门',
                    field: 'deptName'
                }],
                responseHandler: function (res) {
                    return {
                        total: res.page.totalCount,
                        rows: res.page.list
                    };
                }
            });
        })
        var pzcurmainDetailObj = new Object({
            mainId: undefined,
            applyType: undefined,
            data: undefined,
            dataSelect: undefined,
            myTableUser: undefined,
            tripToggle: function (show) {
                if (show) {
                    $('.trip').removeClass('d-none');
                } else {
                    $('.trip').addClass('d-none');
                }
            },
            toggleBtn: function (show) {
                if (show) {
                    $('.afterSave').removeClass("invisible");
                } else {
                    $('.afterSave').addClass("invisible");
                }

                // $('.afterSave').addClass("visible");
            },
            saveInfo(){
                $('a[data-toggle="tab"][data-item="detail"]').tab('show')
                pzcurmainDetailInfoObj.submitHandle();
            },
            // 单据提交
            saveAudit: function () {
                let _self = this;
                $.mySwalConfirm(`将提交单据，确认吗？`, function () {
                    $.myPost({
                        url: `/portal/process/instance/saveAuditProcess.json`,
                        data: {pIds: _self.mainId},
                        success: function (data) {
                            if (data && data.success) {
                                toastr.success(data.msg, '操作提示')
                                pzcurmainListObj.refreshDataList();
                            } else {
                                toastr.error(data.msg, '操作失败')
                            }
                        }
                    })
                });
            },
            authHandle: function () {
                this.userToggleModal(true)
            },
            userToggleModal: function (show) {
                $('#pzcurmainDetail_Modal').modal(show ? 'show' : 'hide');
            },
            saveAuthHandle: function () {
                let _self = this;
                let selectUsers = _self.myTableUser.bootstrapTable('getSelections');
                if (selectUsers.length == 0) {
                    $.mySwalWarn("请选择人员");
                    return;
                }
                $.mySwalConfirm(`将此单据委托给${selectUsers[0].name}，确定吗?`, function () {
                    $.myPut({
                        url: `/pz/cur/pzmain/saveAuth`,
                        dataType: 'json',
                        data: {
                            mainId: pzcurmainListObj.mainId,
                            authToUserCode: selectUsers[0].workNo
                        },
                        success: function (data) {
                            if (data && data.code === 0) {
                                toastr.success("委托成功", '操作提示')
                                _self.userToggleModal(false)
                            } else {
                                toastr.error(data.msg, '操作失败')
                            }
                        }
                    })
                });
            }
        });
    </script>
</div>
</body>
</html>